import React from 'react';
import { BrowserRouter as Router, Route, Routes, Link } from 'react-router-dom';
import Home from './home'   
import About from './about'
// 定义 Home 组件  
// const Home = () => {
//     return (
//         <div>
//             <h1>Home Page</h1>
//             <p>Welcome to the home page!</p>
//             <Link to="/about">Go to About Page</Link>
//         </div>
//     );
// };

// // 定义 About 组件  
// const About = () => {
//     return (
//         <div>
//             <h1>About Page</h1>
//             <p>This is the about page.</p>
//             <Link to="/">Go to Home Page</Link>
//         </div>
//     );
// };

// 定义 App 组件  
const App = () => {
    return (
        <Router>
            <div>
                <nav>
                    <ul>
                        <li>
                            <Link to="/">Home</Link>
                        </li>
                        <li>
                            <Link to="/about">About</Link>
                        </li>
                    </ul>
                </nav>

                <Routes>
                    <Route path="/" element={<Home />} />
                    <Route path="/about" element={<About />} />
                </Routes>
            </div>
        </Router>
    );
};

export default App;